<html>

<head>


										
<title>Timetable</title>

<script type="text/javascript" src="../Timetable/jquery-ui-1.8.18.custom/js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="../Timetable/jquery-ui-1.8.18.custom/js/jquery-ui-1.8.18.custom.min.js"></script>



<?php

session_start(); 

?>	

<?php 
if(!isset($_SESSION["username"])) 
   { 
   echo "Bitte erst <a href=\"login.html\">einloggen</a>"; 
   exit; 
   } 
?> 

	

	
<?php
	
//Wert aus Datenbank in Draggable

mysql_connect ("localhost","root","");
mysql_select_db("timetable");


$username = $_SESSION["username"];

$sql = "Select PositionTop, PositionLeft from user where username ='$username' ";

$res = mysql_query ($sql);

$dsatz = mysql_fetch_assoc($res);


$NeuPositionTop =$dsatz ["PositionTop"];
$NeuPositionLeft =$dsatz ["PositionLeft"];



/*

echo $dsatz ["PositionTop"];
echo "<br>";
echo $dsatz ["PositionLeft"];

*/

?>



	


	<script>
					
	$(function() {		
		$( "#draggable" ).draggable({
		
		    drag: function(event,ui){
              
             // Aktuelle Position ausgeben $('#dragpos').html('LEFT: '+ui.position.left + ' ; TOP: '+ui.position.top)
               
               
                           
               dragposition = ui.position; 
               
             
	
	        }
       });    
             
                  
      
       
       $( "#draggable" ).draggable({
           stop: function(event, ui) { 
           
              var inputdragtop = '<input type="hidden" name="dragpositiontop" id="dragposition" value="'+dragposition.top+'"/>'
              var inputdragleft = '<input type="hidden" name="dragpositionleft" id="dragposition" value="'+dragposition.left+'"/>'

              var submit    = '<input style ="position:top;" type="submit" name="Speichern" value="Speichern">'
              $('#myform').empty();
              $('#myform').prepend(inputdragtop);
               $('#myform').prepend(inputdragleft);
              $('#myform').prepend(submit);


            }



        });
       
       	$( ".OneHour" ).droppable({
		    drop: function( event, ui ) {
		        $( this )
		        
		       
		        .css("background-color","yellow")
	             
	             .find( "p" )
						.html( "Dropped!" );

	
	        }
       });  
       	
		$( "#droppable" ).droppable({
			drop: function( event, ui ) {
				$( this )
				
					.css("background-color","yellow")
					
					.find( "p" )
						.html( "Dropped!" );
					

			}
		});
								
	});
	</script>
	
	
	
	

</head>

<body>






<table style="position:absolute; top:150px;" border="1">
<tr>
<th>Uhrzeit</th>
<th>Montag</th>
<th>Dienstag</th>
<th>Mittwoch</th>
<th>Donnerstag</th>
<th>Freitag</th>
<th>Samstag</th>
<th>Sonntag</th>
</tr>

<tr>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>

</tr>


<tr>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>

</tr>

<tr>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>
<td class="OneHour" style="width:150px; height:100px" bgcolor="silver"></td>

</tr>




</table>




<div id="droppable" style="position:absolute; left:1260px; width:470px; height:600px; background-color:gray">
<p>Drop here</p>
</div>

<?php
echo '<div id="draggable" style="position:absolute; top:' . $NeuPositionTop . 'px; left:' . $NeuPositionLeft . 'px; width:140px; height:90px; background-color:blue">';
echo '<p>Drop here</p>';
echo '</div>';

?>


<div style="position:absolute; top:550px" id="dragpos"></div>


<form style="position:absolute; top:0px; left:0px;" id="myform" action="timetable-update.php" method="post">

</form>



<form style="position:absolute; top:0px; left:90px;" action="logout.php" method="post">
<input type="submit" value="Logout">
</form>







</body>

</html>
